<div class="pwd-box">
    <div class="pwd-title-box flex-box">
        <div class="pwd-title flex-item">{$app.name} - 账号列表</div>
        <div class="pwd-add-box">
            <button class="layui-btn layui-btn-sm layui-btn-normal pwd-add-{$rand}"><i class="layui-icon layui-icon-add-1"></i> 添加</button>
        </div>
    </div>
    <div class="pwd-item pwd-item-head flex-box">
        <div class="seq">序号</div>
        <div class="name">名称</div>
        <div class="account flex-item">账号</div>
        <div class="setup">操作</div>
    </div>
    {volist name='list' id='vo'}
    <div class="pwd-item flex-box">
        <div class="seq">{:count($list) + 1 - $i}</div>
        <div class="name ellipsis">{$vo.name}</div>
        <div class="account flex-item">{$vo.account}</div>
        <div class="setup">
            <div class="layui-btn-group" id="{$vo.id}">
                <button type="button" class="layui-btn layui-btn-normal layui-btn-xs pwd_show">
                    <i class="layui-icon">&#xe609;</i>
                </button>
                <button type="button" class="layui-btn layui-btn-xs pwd_edit">
                    <i class="layui-icon">&#xe642;</i>
                </button>
                <button type="button" class="layui-btn layui-btn-danger layui-btn-xs pwd_del">
                    <i class="layui-icon">&#xe640;</i>
                </button>
            </div>
        </div>
    </div>
    {/volist}
    {if count($list)==0}
        <div class="empty">
            <img src="__IMG__/empty.png">
        </div>
    {/if}
</div>

<script>
    $(document).on('click', '.pwd-add-{$rand}', function() {
        _get(`index/index/pwd_add?id={$app.id}`, c => {
            if(c && c.code == -1) {
                _tip(c.msg, 2)
                return
            }
            layer.open({
                title: '{$app.name} - 添加账户',
                type: 1, 
                content: c,
                offset: 'auto',
                area: ['auto', 'auto'],
                fixed: true,
                maxmin: true,
                anim: 2,
                success: function(layero, index) {
                    form.render()
                    form.on('submit(add_pwd)', d => {
                        _post('/index/api/add_pwd', d.field, c => {
                            if(c && c.code == 1) {
                                _tip('添加成功', 6)
                                layer.close(index)
                                let count = $('.pwd-item').length, data = d.field
                                let dom = `
                                <div class="pwd-item flex-box">
                                    <div class="seq">${count}</div>
                                    <div class="name ellipsis">${data.name}</div>
                                    <div class="account flex-item">${data.account}</div>
                                    <div class="setup">
                                        <div class="layui-btn-group" id="${c.data}">
                                            <button type="button" class="layui-btn layui-btn-normal layui-btn-xs pwd_show">
                                                <i class="layui-icon">&#xe609;</i>
                                            </button>
                                            <button type="button" class="layui-btn layui-btn-xs pwd_edit">
                                                <i class="layui-icon">&#xe642;</i>
                                            </button>
                                            <button type="button" class="layui-btn layui-btn-danger layui-btn-xs pwd_del">
                                                <i class="layui-icon">&#xe640;</i>
                                            </button>
                                        </div>
                                    </div>
                                </div>
                                `
                                $('.pwd-item-head').after(dom)
                                if($('.empty').length > 0) 
                                    $('.empty').hide()
                            } else {
                                _tip('添加失败', 5)
                            }
                        })
                        return false
                    })
                }
            })
        })
    })

</script>